<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>随访记录</title>
    <%- include('../_global/baseLibsJKDA') %>
        <link rel="stylesheet" href="/static/css/public.css" />
        <link rel="stylesheet" href="/static/css/jkda/page-main.css" />
        <!--<link rel="stylesheet" href="/static/css/public.css">-->
        <style type="text/css">
            html,
            body {
                width: 100%;
                height: 100%;
                margin: 0px;
                /* background-color: white; */
            }

            #ListTabBox .tab {
                display: block !important;
            }

            .bg_white {
                background: #fff;
            }

            .detail .list {
                border-bottom: 1px solid #eee;
                margin-top: 10px;
                background-color: #fff;
                /* height: 14.25rem; */
                padding-left: 0.8rem;
                padding-top: .8rem;
                padding-bottom: .8rem;
            }


            .detail li {
                /* padding: 0.3rem 0; */
                font-size: 0.95238rem;
                /* margin: 0 0.95238rem; */
                color: #969696;
                margin-top: .5rem;
                font-size: 1.1rem;
            }

            .detail .list li:nth-child(1) {
                color: #333;
                font-size: 1.2rem;
            }

            #ListTab {
                background-color: #fff;
            }
        </style>
</head>

<body>
    <header class="header-box grey fixed">
        <div class="header-content">
            <div class="left-tool">
                <a class="back" href="javascript:void(0);">
                    <i class="iconfont icon-back"></i>
                </a>
            </div>
            <div class="title">随访记录</div>
        </div>
    </header>
    <div class="tab-box">
        <span class="gray-line"></span>
        <ul id="ListTab" class="clearfix">
            <li class="active" value="gxy">
                <a>高血压</a>
            </li>
            <li value="tnb">
                <a>糖尿病</a>
            </li>
        </ul>
    </div>
    <div id="ListTabBox bg_white">
        <ul class="detail">
            <li class="b-box" id="gxy" style="border-bottom: 0px;">
                <div id="gxysf"> </div>
            </li>
            <li class="b-box" id="tnb" style="border-bottom: 0px;">
                <div id="tnbsf"> </div>
            </li>
        </ul>
    </div>

</body>
<script type="text/javascript">
    var page_sfjl = (function ($, page_sfjl) {

        var zxwyh = $.QuickUrlUtils.getRequest("ZXWYH");

        var cfg_def = {
            indataGXY: indataGXY,
            indataTNB: indataTNB,
            gxyData: gxyData,
            tnbData: tnbData,
        }

        page_sfjl.init = function (cfg) {
            $.extend(page_sfjl, cfg_def, cfg);
            page_sfjl.indataGXY();
            page_sfjl.indataTNB();
            $("#tnb").hide();

            /**选择高血压或者糖尿病*/
            $("#ListTab").on("click", "li", function () {
                $(this).addClass('active').siblings("li").removeClass("active");
                var value = $(this).attr("value");
                if (value == "gxy") {
                    $("#gxy").show();
                    $("#tnb").hide();

                } else {
                    $("#gxy").hide();
                    $("#tnb").show();
                }
            });


        }

        function indataGXY() {
            //查询高血压
            $.QuickRemote.AjaxJson({
                funcName: "/api/gzd/jkda/getHDEPDataService",
                callback: page_sfjl.gxyData,
                params: {
                    "zxwyh": zxwyh,
                    // "zxwyh": "310224197111115027",
                },
                header: true
            });
        }

        function indataTNB() {
            //查询糖尿病
            $.QuickRemote.AjaxJson({
                funcName: "/api/gzd/jkda/getDabetesDataService",
                callback: page_sfjl.tnbData,
                params: {
                    "zxwyh": zxwyh,

                    // "zxwyh": "310103195411010837",
                },
                header: true
            });
        }



        function gxyData(response) {
            $("#gxysf").html(template("gxyList", {
                data: response
            }));
        }

        function tnbData(response) {
            $("#tnbsf").html(template("tnbList", {
                data: response
            }));
        }




        return page_sfjl;
    })(jQuery, {});
</script>
<script type="text/html" id="gxyList">
    {{each data}}
    <div class="list">
        <li>随访日期：{{$value.date}}</li>
        <li>收缩压：{{$value.sbp}}mmol/l</li>
        <li>舒张压：{{$value.dbp}}mmol/l</li>
    </div>
    {{/each}}
</script>
<script type="text/html" id="tnbList">
    {{each data}}
    <div class="list">
        <li>随访日期：{{$value.date}}</li>
        <li>空腹血糖：{{$value.fbg}}mmol/l</li>
        <li>随机血糖：{{$value.rbg}}mmol/l</li>
        <li>餐后2h血糖：{{$value.ppb}}mmol/l</li>
    </div>
    {{/each}}
</script>

</html>